<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>个人信息</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<style>
			* {
				margin: 0px;
				padding: 0px;
			}
			/**该css为解决滑动时候警告：Unable to preventDefault inside passive event listener**/
			* { touch-action: pan-y; } 
			body {
				background-color: #FFFFFF;
			}
			.mui-content {
				background-color: #FFFFFF;
			}
			.mui-segmented-control {
				border-radius: 50px;
				border: 1px solid #5BA9F9;
			}
			.mui-segmented-control .mui-control-item.mui-active {
			    color: #fff;
			    background-color: #5BA9F9;
			}
			.mui-segmented-control .mui-control-item {
			    color: #5BA9F9;
			    border-color: #5BA9F9;
			    border-left: 1px solid #5BA9F9;
			}
			.mui-table-view-cell:after {
				left: 0px;
			}
			.inline {
				display: inline-block;
			}
			.right {
				float: right;
			}
			.margin-l-r-10 {
				margin-left: 10px;
				margin-right: 10px;
			}
			.mui-table-view-cell .left img {
				width: 24px;
				height: 24px;
				vertical-align: middle;
			}
			.mui-table-view-cell .inline span {
				font-family: 'PingFangSC-Regular';
				font-size: 15px;
				color: #4C4C4C;
				margin-left: 5px;
			}
			.mui-table-view-cell .right img {
				width: 10px;
				height: 20px;
				vertical-align: middle;
				margin-left: 10px;
			}
			.mui-table-view-cell .right span {
				font-family: 'PingFangSC-Regular';
				font-size: 15px;
				color: #5BA9F9;
			}
			.applyId-span {
				display: none;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">个人信息</h1>
		</header>
		<div class="mui-content">
			<div style="padding: 10px 10px;">
				<div id="segmentedControl" class="mui-segmented-control">
					<a id="photoData" data-type="1" class="mui-control-item mui-active" href="#item1">拍摄资料</a>
					<a id="detailData"data-type="2" class="mui-control-item" href="#item2">详细资料</a>
				</div>
			</div>
			<div>
				<div id="item1" class="mui-control-content mui-active">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell" data-type="1">
							<div class="inline left margin-l-r-10">
								<img src="../img/detail/camera_norm.png" />
								<span>照片</span>
							</div>
							<div class="inline right margin-l-r-10">
								<span class="applyId-span" id="photo">待上传</span>
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="2">
							<div class="inline left margin-l-r-10">
								<img src="../img/detail/camera_norm.png" />
								<span>护照首页</span>
							</div>
							<div class="inline right margin-l-r-10">
								<span class="applyId-span" id="huzhao">待上传</span>
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="3">
							<div class="inline left margin-l-r-10">
								<img src="../img/detail/camera_norm.png" />
								<span>身份证</span>
							</div>
							<div class="inline right margin-l-r-10">
								<span class="applyId-span" id="shengfz">待上传</span>
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="4">
							<div class="inline left margin-l-r-10">
								<img src="../img/detail/camera_norm.png" />
								<span>户口本</span>
							</div>
							<div class="inline right margin-l-r-10">
								<span class="applyId-span" id="hkb">待上传</span>
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="5">
							<div class="inline left margin-l-r-10">
								<img src="../img/detail/camera_norm.png" />
								<span>婚姻状况</span>
							</div>
							<div class="inline right margin-l-r-10">
								<span class="applyId-span" id="hyzk">待上传</span>
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="6">
							<div class="inline left margin-l-r-10">
								<img src="../img/detail/camera_norm.png" />
								<span>辅助资产</span>
							</div>
							<div class="inline right margin-l-r-10">
								<span class="applyId-span" id="fzzc">待上传</span>
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
					</ul>
				</div>
				<div id="item2" class="mui-control-content">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell" data-type="1">
							<div class="inline left margin-l-r-10">
								<span>基本信息</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="2">
							<div class="inline left margin-l-r-10">
								<span>职业经历</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="3">
							<div class="inline left margin-l-r-10">
								<span>联系方式</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="4">
							<div class="inline left margin-l-r-10">
								<span>出境记录</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="5">
							<div class="inline left margin-l-r-10">
								<span>教育经历</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="6">
							<div class="inline left margin-l-r-10">
								<span>护照信息</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="7">
							<div class="inline left margin-l-r-10">
								<span>家庭信息</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
						<li class="mui-table-view-cell" data-type="8">
							<div class="inline left margin-l-r-10">
								<span>紧急联系人</span>
							</div>
							<div class="inline right margin-l-r-10">
								<img src="../img/detail/go_more.png" />
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../js/thirdparty/jquery-3.3.1.js" ></script>
	<script type="text/javascript" src="../js/thirdparty/mui.min.js" ></script>
	<script type="text/javascript" src="../js/thirdparty/spin.min.js" ></script>
	<script type="text/javascript" src="../js/utils/boot.js" ></script>
	<script type="text/javascript">
		var customerId = base.getParameter("customerId");
		var applyCustomerId = base.getParameter("applyCustomerId");
		var tempIsPersonInfo = localStorage.getItem("isPersonInfo");
		$(function() {
			if (tempIsPersonInfo == 1) {
				$("#photoData").removeClass("mui-active");
				$("#detailData").addClass("mui-active");
				$("#item1").removeClass("mui-active");
				$("#item2").addClass("mui-active");
			}
			iosPageRefresh(); 
			getVisaApplyCustomerInfoByIdData();
		})
		$("#segmentedControl").on("tap", "a", function() {
			var _type = $(this).data("type");
			if(_type == 1) window.localStorage.removeItem("isPersonInfo");
		})
		$('#item1').on('tap', '.mui-table-view-cell', function() {
			window.localStorage.removeItem("isPersonInfo"); //清除缓存的是否默认选中详细资料
			var typeID = $(this).data('type');
			switch (typeID){
				case 1:
					window.location.href = "headerPhoto.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 2:
					window.location.href = "passportPhoto.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 3:
					window.location.href = "IDCardPhoto.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 4:
					window.location.href = "bookletPhoto.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 5:
					window.location.href = "marriagePhoto.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 6:
					window.location.href = "otherPhoto.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				default:
					break;
			}
		});
		$('#item2').on('tap', '.mui-table-view-cell', function() {
			window.localStorage.setItem("isPersonInfo", 1);
			var typeID = $(this).data('type');
			switch (typeID){
				case 1:
					window.location.href = "personInfoDetail.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 2:
					window.location.href = "personInfoProfession.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 3:
					window.location.href = "personInfoContact.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 4:
					window.location.href = "personInfoOutbound.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 5:
					window.location.href = "personInfoEducation.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 6:
					window.location.href = "personInfoPassport.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 7:
					window.location.href = "personInfoFamily.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				case 8:
					parent.location.href = "personInfoContactJingji.html?customerId="+customerId+"&applyCustomerId="+applyCustomerId;
					break;
				default:
					break;
			}
		});
		function getVisaApplyCustomerInfoByIdData() {
			var url = base.url.getVisaApplyCustomerInfoById;
			var params = {
				applyCustomerId: applyCustomerId,
			}	
			base.postData(url, params, function(data) {
				if (data.success) {
					if (data.extendData.isApplyPersonImg == 1) {
						$('#photo').hide();
					}else{
						$('#photo').show();
					}
					if (data.extendData.isPassportNum == 1) {
						$('#huzhao').hide();
					}else{
						$('#huzhao').show();
					}
					if (data.extendData.isIdentityCard == 1) {
						$('#shengfz').hide();
					}else{
						$('#shengfz').show();
					}
					if (data.extendData.isVisaHouseholdsImg == 1) {
						$('#hkb').hide();
					}else{
						$('#hkb').show();
					}
					if (data.extendData.isVisaMarriageImg == 1) {
						$('#hyzk').hide();
					}else{
						$('#hyzk').show();
					}
					if (data.extendData.isVisaPropertyImg == 1) {
						$('#fzzc').hide();
					}else{
						$('#fzzc').show();
					}
				} else {
					mui.toast(data.message);
				}
			});
		}
		function iosPageRefresh () { //ios页面返回当前页时强制刷新
			var isPageHide = false;   
			window.addEventListener('pageshow', function () {      
			    if (isPageHide) {        
			      window.location.reload();      
			    }    
			});    
			window.addEventListener('pagehide', function () {
			    isPageHide = true;    
			});
		}
	</script>
</html>